<!-- $Id$
 *
 * Red Pitaya Impedance analyzer
 *
 *
 * (c) Red Pitaya  http://www.redpitaya.com
 *
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="cache-control" content="max-age=0" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
    <meta http-equiv="pragma" content="no-cache" />
    <title>Red Pitaya</title>

    <link href="../assets/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="../assets/loader.css?1" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="../assets/lpulse.css?1" type="text/css">
    <link rel="stylesheet" href="../assets/usermis.css" type="text/css">
    <link href="../assets/popupstack.css" rel="stylesheet" type="text/css" />
    <link href="../assets/help-system/help-system.css" rel="stylesheet" type="text/css" />
    <link href="css/style.css?2" rel="stylesheet">

    <script src="../assets/jquery/jquery-2.1.3.min.js"></script>
    <script src="../assets/jquery/jquery-ui.min.js"></script>
    <script src="../assets/jquery/jquery.ui.touch-punch.min.js"></script>
    <script src="../assets/jquery/jquery.flot.js"></script>
    <script src="../assets/jquery/jquery.mousewheel.min.js"></script>
    <script src="../assets/jquery/jquery.simulate.js"></script>
    <script src="../assets/jquery/jquery.cookie.js"></script>
    <script src="../assets/jquery/jquery.browser.js"></script>
    <script src="../assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="../assets/browsercheck.js?1"></script>
    <script src="../assets/pako.js"></script>
    <script src="../assets/offline.min.js?1"></script>
    <script src="../assets/ui.js"></script>
    <script src="../assets/onlinecheck.js?1"></script>
    <script src="../assets/popupstack.js?1"></script>
    <script src="../assets/help-system/help-system.js"></script>
    <script src="js/html2canvas.min.js?1" onerror="location.reload()"></script>
    <script src="js/cursors.js" onerror="location.reload()"></script>
    <script src="js/guiHandler.js?1" onerror="location.reload()"></script>
    <script src="js/main.js?1" onerror="location.reload()"></script>
    <script src="js/client.js?1" onerror="location.reload()"></script>

</head>

<body class="user_lost connection_lost">
    <div id="user-wrapper">
        <div id="user"></div>
        <div id="user-desc">Device is already in use by another user.</div>
    </div>
    <div id="pulse-wrapper">
        <div id="pulse"></div>
        <div id="pulse-desc">Connection with device is lost.</div>
    </div>
    <div id="loader-wrapper">
        <div id="loader"></div>
        <div id="calibration">Calibrating...</div>
    </div>
    <div id="header">
    </div>
    <div id="img_loading" class="img-container">
        <div class="centerer"></div>
        <img src="img/loader_auto_scale.gif" width="90">
    </div>
    <div class="full-content">
        <div class="container-fluid">
            <div class="navbar navbar-inverse" role="navigation">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                            <span class="sr-only">T</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a id="back_button" class="navbar-brand" href="/">
                            <img class="back-btn" src="../assets/images/navigation_arrow_left.png">
                        </a>
                        <a class="navbar-brand" href="/">
                            <img class="back-btn" src="../assets/images/home.png">
                        </a>
                        <img class="logo" width=110 src="../assets/images/navigation_logo.png">
                    </div>
                    <div class="collapse navbar-collapse">
                        <ul class="nav navbar-nav">
                            <li style="width: 60px">
                                <a href="https://redpitaya.readthedocs.io/en/latest/appsFeatures/applications/marketplace/impedance.html" target="_blank" style="padding-left: 0; padding-right: 0;">
                                    <img src="../assets/images/help.png" width=20px>
                                </a>
                            </li>
                            <li class="dropdown">
                                <a class="btn btn-default dropdown-toggle" type="button" id="dd_menu" data-toggle="dropdown" style="padding-left: 20px;">MENU<span class="caret"></span></a>
                                <ul class="dropdown-menu" role="menu" aria-labelledby="menu1" style="background: #cdcccc; min-width: 0px;">
                                    <li><a id="downl_graph" href="#">Export Graph</a></li>
                                    <li><a id="downl_csv" href="#">Export in CSV</a></li>
                                    <li><a id="reset_settings" href="#">RESET</a></li>
                                </ul>
                            </li>
                            <li>
                                <a id="IA_RUN" href="#" style="">RUN</a>
                                <a id="IA_STOP" href="#" style="display:none;">STOP</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- Modal export-->
            <div class="modal" id="export" tabindex="-1" role="dialog" aria-labelledby="export" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title">Export</h4>
                        </div>
                        <div class="modal-body">
                            Content
                        </div>
                    </div>
                </div>
            </div>
            <!-- Modal settings-->
            <div class="modal" id="settings" tabindex="-1" role="dialog" aria-labelledby="export" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title">Settings</h4>
                        </div>
                        <div class="modal-body">
                            Content settings
                        </div>
                    </div>
                </div>
            </div>
            <div id="global_container" style="position: relative;">
                <!-- Menu container -->
                <div class="menu-content">
                    <!-- Main menu -->
                    <div id="right_menu" class="row right-menu-cont">
                        <div class="col-xs-6 option-content">
                            <div class="right-menu-option">
                                Settings
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div id="setting_button" class="right-menu-option edit-mode">
                                <img src="img/gear.png">
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div class="right-menu-option">
                                Plot settings
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div id="plot_setting_button" class="right-menu-option edit-mode">
                                <img src="img/gear.png">
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <div id="cursor" class="right-menu-option edit-mode">
                                CURSORS
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <div class="right-menu-option">
                                <img id="IA_LCR_EXT" src="img/green_led.png" style="width: 20px;height: 20px;">LCR extension
                            </div>
                        </div>
                    </div>
                    <!-- Settings menu -->
                    <div id="setting_button_dialog" class="dialog row right-menu-cont">
                        <div class="col-xs-12 option-content">
                            <div class="set_dialog right-menu-option close-dialog">
                                <img src="../assets/images/navigation_arrow_left.png"> Settings
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <span class="col-info">Start frequency [Hz]</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_START_FREQ" class="setfield input-number" type="text" value="1000" step="1" min="0" max="62500000">
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <span class="col-info">End frequency [Hz]</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_END_FREQ" class="setfield input-number" type="text" value="10000" step="1" min="1" max="62500000">
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <span class="col-info">Steps</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_STEPS" class="setfield input-number" type="text" value="25" step="1" min="1" max="62500000">
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <span class="col-info">Averaging</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_AVERAGING" class="setfield input-number" type="text" value="1" step="1" min="1" max="10">
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <span class="col-info">Amplitude [V]</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_AMPLITUDE" class="setfield input-number" type="text" value="1" step="0.01" min="0" max="1">
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <span class="col-info">DC bias [V]</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_DC_BIAS" class="setfield input-number" type="text" value="0" step="0.01" min="-1" max="1">
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <span class="col-info">Measure scale</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <div class="btn-group btn-group-justified" data-toggle="buttons">
                                    <label id="IA_SCALE0" class="btn">
                                        <input type="radio" value="0" name="IA_SCALE" id="IA_SCALE" autocomplete="off">Lin
                                    </label>
                                    <label id="IA_SCALE1" class="btn active">
                                        <input type="radio" value="1" name="IA_SCALE" id="IA_SCALE1" autocomplete="off">Log
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12 option-content" id="LCR_SHUNT_BOX" style="display: none;">
                            <div class="right-menu-option">
                                <span class="col-info" style="margin-top: -21px;">Shunt [Ω]</span>
                                <select id="IA_LCR_SHUNT" class="form-control styled-select" style="margin-top: 10px;">
                                    <option value="0">10</option>
                                    <option value="1">100</option>
                                    <option value="2">1k</option>
                                    <option value="3">10k</option>
                                    <option value="4">100k</option>
                                    <option value="5">1M</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-12 option-content" id="SHUNT_BOX" style="display: none;">
                            <span class="col-info">Shunt [Ω]</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <input id="IA_SHUNT" class="setfield input-number" type="text" value="1" step="1" min="1" max="10000000">
                            </div>
                        </div>
                    </div>
                    <!-- Plot settings menu -->
                    <div id="plot_setting_button_dialog" class="dialog row right-menu-cont">
                        <div class="col-xs-12 option-content">
                            <div class="set_dialog right-menu-option close-dialog">
                                <img src="../assets/images/navigation_arrow_left.png"> Plot settings
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <div class="right-menu-option">
                                <span class="col-info" style="margin-top: -21px;">Y-axis</span>
                                <select id="IA_Y_AXIS" class="form-control styled-select" style="margin-top: 10px;">
                                    <option value="1">|Z| [Ohm]</option>
                                    <option value="2">P [deg]</option>
                                    <option value="3">|Y| [S]</option>
                                    <option value="4">-P [deg]</option>
                                    <option value="5">Rs [Ohm]</option>
                                    <option value="6">Rp [Ohm]</option>
                                    <option value="7">Xs [Ohm]</option>
                                    <option value="8">Gp [S]</option>
                                    <option value="9">Bp [S]</option>
                                    <option value="10">Cs [F]</option>
                                    <option value="11">Cp [F]</option>
                                    <option value="12">Ls [H]</option>
                                    <option value="13">Lp [H]</option>
                                    <option value="14">Q</option>
                                    <option value="15">D</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-12 option-content">
                            <span class="col-info">Scale</span>
                            <div class="right-menu-option" style="margin-top: 10px;">
                                <div class="btn-group btn-group-justified" data-toggle="buttons">
                                    <label id="IA_SCALE_PLOT0" class="btn">
                                        <input type="radio" value="0" name="IA_SCALE_PLOT" id="IA_SCALE_PLOT" autocomplete="off">Lin
                                    </label>
                                    <label id="IA_SCALE_PLOT1" class="btn active">
                                        <input type="radio" value="1" name="IA_SCALE_PLOT" id="IA_SCALE_PLOT1" autocomplete="off">Log
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="cursor_dialog" class="dialog row right-menu-cont">
                        <div class="col-xs-12 option-content close-dialog">
                            <div class="right-menu-option">
                                <img src="../assets/images/navigation_arrow_left.png"> Cursor
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div class="right-menu-option">
                                <button id="IA_CURSOR_X1_ENABLE" type="button" class="btn" data-toggle="button" aria-pressed="false" autocomplete="off">X1</button>
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div class="right-menu-option">
                                <button id="IA_CURSOR_X2_ENABLE" type="button" class="btn" data-toggle="button" aria-pressed="false" autocomplete="off">X2</button>
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div class="right-menu-option">
                                <button id="IA_CURSOR_Y1_ENABLE" type="button" class="btn" data-toggle="button" aria-pressed="false" autocomplete="off">Y1</button>
                            </div>
                        </div>
                        <div class="col-xs-6 option-content">
                            <div class="right-menu-option">
                                <button id="IA_CURSOR_Y2_ENABLE" type="button" class="btn" data-toggle="button" aria-pressed="false" autocomplete="off">Y2</button>
                            </div>
                        </div>
                    </div>
                    <!-- Measurement loader -->
                    <div id="measuring-status">
                        <div id="measuring-loader">

                        </div>
                        Measuring...
                    </div>
                </div>

                <!-- Main container -->
                <div id="main">
                    <div id="graphs_holder">
                        <div id="IA_CUR_INFO">Current step: <span id="IA_CUR_STEP" style="margin-right: 40px">1</span>Current freq: <span id="IA_CUR_FREQ">1Hz</span></div>
                        <div style="clear: both; position: relative; padding: 0px; margin: 0px;">
                            <div id="graph_bode" class="graphs">
                                <canvas id="graph_bode_grid" class="graph_grid"></canvas>
                                <img id="cur_x1_arrow" class="varrow" src="img/cursor-arrow-up.png">
                                <div id="cur_x1" class="vline"></div>
                                <div id="cur_x1_info" class="cur_info"></div>
                                <img id="cur_x2_arrow" class="varrow" src="img/cursor-arrow-up.png">
                                <div id="cur_x2" class="vline"></div>
                                <div id="cur_x2_info" class="cur_info"></div>
                                <div id="cur_x_diff"></div>
                                <div id="cur_x_diff_info" class="cur_info"></div>

                                <img id="cur_y1_arrow" class="harrow" src="img/cursor-arrow-left.png">
                                <div id="cur_y1" class="hline"></div>
                                <div id="cur_y1_info" class="cur_info"></div>
                                <img id="cur_y2_arrow" class="harrow" src="img/cursor-arrow-left.png">
                                <div id="cur_y2" class="hline"></div>
                                <div id="cur_y2_info" class="cur_info"></div>
                                <div id="cur_y_diff"></div>
                                <div id="cur_y_diff_info" class="cur_info"></div>

                                <!-- <div id="cur_rectangle" style="position: fixed;border: 2px solid;"></div> -->

                            </div>

                            <div class="clear info-graph">
                                <div id="amplitude-info" class="left-info"></div>
                                <div id="freq-info" class="text-center">Frequency [Hz]</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="calibration_dialog" tabindex="-1" role="dialog" aria-labelledby="bazaar_naLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="bazaar_naLabel">Calibration</h4>
                </div>
                <div class="modal-body" style="text-align: center; font-size: 18px;">
                    <p> To calibrate your setup connect IN2 to IN1 (bypass DUT) and press CALIBRATE. </p>
                    <img id="CALIB_BODE_IMG" width="540" src="img/Bode_cal.png">
                </div>
                <div class="modal-footer">
                    <div class="bazaar-link" style="float: right; width: 50%;" id="calib_btn">
                        <div href="#" style="border: 1px solid;" class="list-group-item btn" id="calibration-button">Calibrate</div>
                    </div>
                    <div class="bazaar-link" style="float: right; width: 50%;" id="calib_reset_btn">
                        <div href="#" style="border: 1px solid;" class="list-group-item btn" id="reset-calibration-button">Reset Calibration</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="feedback_error" tabindex="-1" role="dialog" aria-labelledby="bazaar_naLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="oops_label">Oops, something went wrong</h4>
                </div>
                <div class="modal-body" style="text-align: center; font-size: 18px;">
                    <p>Please send us the report and help us to fix this issue</p>
                    <p>Thank you!</p>
                </div>
                <div class="modal-footer">
                    <div class="bazaar-link" style="float: left; width: 50%;">
                        <a href="#" style="border: 1px solid;  width: 100%" id="send_report_btn" data-dismiss="modal" class="list-group-item btn">Send report</a>
                    </div>
                    <div class="bazaar-link" style="float: left; width: 50%;">
                        <a href="#" style="border: 1px solid;  width: 100%" id="restart_app_btn" data-dismiss="modal" class="list-group-item btn">Restart Application</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>